<template>
	<view class="container" style="background-color: #fff;">
		<view class="floor">
			<view class="title">报修单号</view>
			<view class="content">{{dict.no}}</view>
		</view>
		<view class="floor">
			<view class="title">报修标题</view>
			<view class="content">{{dict.title}}</view>
		</view>
		<view class="floor">
			<view class="title">报修电话</view>
			<view class="content">{{dict.applyPhone}}</view>
		</view>
		<view class="floor">
			<view class="title">派工人员</view>
			<view class="content">{{dict.applyName}}</view>
		</view>
		<view class="floor">
			<view class="title">报修的内容</view>
			<view class="content">{{dict.applyContent}}</view>
		</view>
		<view class="floor">
			<view class="title">报修时间</view>
			<view class="content">{{dict.createTime.replace("T"," ")}}</view>
		</view>
		<view class="floor">
			<view class="title">派工单时间</view>
			<view class="content">{{dict.appointmentTime}}</view>
		</view>
		<view class="floor">
			<view class="title">问题确认备注</view>
			<view class="content">{{dict.confirmContent}}</view>
		</view>
		<view class="floor">
			<view class="title">指派维修人员</view>
			<view class="content">{{dict.repairUserName}}</view>
		</view>
		<view class="floor">
			<view class="title">修理备注</view>
			<view class="content">{{dict.repairContent}}</view>
		</view>
		<view class="floor" style="border: none;">
			<view class="title">维修图片</view>
			<view class="content picList" style="height: 80px;border: none;">
				<image v-for="(item,index) in dict.applyImg.split(',')" :src="item" @click="previewPic(item,index)"></image>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				picList: [
					"/static/60x60.png",
					"/static/c1.png",
					"/static/c2.png",
					"/static/60x60.png",
					"/static/c1.png",
					"/static/c2.png"
				],
				dict: {}
			}
		},
		onLoad(t) {
			this.dict = JSON.parse(t.detail);
		},
		methods: {
			previewPic(item, index) {
				var that = this;
				uni.previewImage({
					urls: that.dict.applyImg.split(","),
					current: index
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	uni-input {
		height: 70rpx !important;
		line-height: 70rpx !important;
	}

	.floor {
		width: 100%;
		overflow: hidden;
		margin-bottom: 5px;

		.title {
			float: left;
			width: 120px;
			line-height: 70rpx;
			text-align: center;
			font-size: 28rpx;
			color: #666666;
			background-color: #fff;
		}

		.content {
			float: left;
			width: calc(100% - 140px);
			height: 70rpx;
			line-height: 70rpx;
			border-bottom: 1px solid #ccc;
			padding: 0 10px;

			uni-button {
				width: 50px;
				height: 50px;
				display: block;
				float: left;
				margin: 10px;
			}

			uni-image {
				width: 50px;
				height: 50px;
				display: block;
				float: left;
				margin: 10px;
			}
		}
	}
</style>